
<!DOCTYPE html>
    <html lang="en">

    <head>
        <meta charset="utf-8" />
        <title>Landrick - Saas & Software Landing Page Template</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="Premium Bootstrap 4 Landing Page Template" />
        <meta name="keywords" content="Saas, Software, multi-uses, HTML, Clean, Modern" />
        <meta name="author" content="Shreethemes" />
        <meta name="email" content="shreethemes@gmail.com" />
        <meta name="website" content="http://www.shreethemes.in" />
        <meta name="Version" content="v2.2" />
        <!-- favicon -->
        <link rel="shortcut icon" href="images/favicon.ico">
        <!-- Bootstrap -->
        <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <!-- Icons -->
        <link href="css/materialdesignicons.min.css" rel="stylesheet" type="text/css" />
        <link rel="stylesheet" href="https://unicons.iconscout.com/release/v2.1.7/css/unicons.css">
        <!-- Magnific -->
        <link href="css/magnific-popup.css" rel="stylesheet" type="text/css" />
        <!-- Slider -->               
        <link rel="stylesheet" href="css/owl.carousel.min.css"/> 
        <link rel="stylesheet" href="css/owl.theme.default.min.css"/>          
        <!-- SLICK SLIDER -->
        <link rel="stylesheet" href="css/slick.css"/> 
        <link rel="stylesheet" href="css/slick-theme.css"/>
        <!-- Main Css -->
        <link href="css/style.css" rel="stylesheet" type="text/css" id="theme-opt" />
        <link href="css/colors/default.css" rel="stylesheet" id="color-opt">

    </head>

    <body>
        <!-- Loader -->
        <!-- <div id="preloader">
            <div id="status">
                <div class="spinner">
                    <div class="double-bounce1"></div>
                    <div class="double-bounce2"></div>
                </div>
            </div>
        </div> -->
        <!-- Loader -->
        
        <!-- Navbar STart -->
        <header id="topnav" class="defaultscroll sticky">
            <div class="container">
                <!-- Logo container-->
                <div>
                    <a class="logo" href="index.html">
                        <img src="images/logo-dark.png" height="24" alt="">
                    </a>
                </div>                 
                <div class="buy-button">
                    <a href="https://1.envato.market/4n73n" target="_blank" class="btn btn-primary">Buy Now</a>
                </div><!--end login button-->
                <!-- End Logo container-->
                <div class="menu-extras">
                    <div class="menu-item">
                        <!-- Mobile menu toggle-->
                        <a class="navbar-toggle">
                            <div class="lines">
                                <span></span>
                                <span></span>
                                <span></span>
                            </div>
                        </a>
                        <!-- End mobile menu toggle-->
                    </div>
                </div>
        
                <div id="navigation">
                    <!-- Navigation Menu-->   
                    <ul class="navigation-menu">
                        <li><a href="index.html">Home</a></li>
                        <li class="has-submenu">
                            <a href="javascript:void(0)">Landing</a><span class="menu-arrow"></span>
                            <ul class="submenu megamenu">
                                <li>
                                    <ul>
                                        <li><a href="index-saas.html">Saas</a></li>
                                        <li><a href="index-classic-saas.html">Classic Saas</a></li>
                                        <li><a href="index-agency.html">Agency</a></li>
                                        <li><a href="index-apps.html">Application</a></li>
                                        <li><a href="index-classic-app.html">Classic Application</a></li>
                                        <li><a href="index-studio.html">Studio</a></li>
                                        <li><a href="index-business.html">Business</a></li>
                                        <li><a href="index-modern-business.html">Modern Business</a></li>
                                        <li><a href="index-hotel.html">Hotel</a></li>
                                        <li><a href="index-marketing.html">Marketing</a></li>
                                        <li><a href="index-enterprise.html">Enterprise </a></li>
                                    </ul>
                                </li>

                                <li>
                                    <ul>
                                        <li><a href="index-insurance.html">Insurance <span class="badge badge-danger rounded">v 2.2</span></a></li>
                                        <li><a href="index-shop.html">Shop <span class="badge badge-danger rounded">v 2.2</span></a></li>
                                        <li><a href="index-ebook.html">E-Book <span class="badge badge-danger rounded">v 2.2</span></a></li>
                                        <li><a href="index-coworking.html">Coworking</a></li>
                                        <li><a href="index-personal.html">Personal </a></li>
                                        <li><a href="index-services.html">Service </a></li>
                                        <li><a href="index-payments.html">Payments </a></li>
                                        <li><a href="index-crypto.html">Cryptocurrency </a></li>
                                        <li><a href="index-software.html">Software </a></li>
                                        <li><a href="index-car-riding.html">Car Ride</a></li>
                                    </ul>
                                </li>
                                <li>
                                    <ul>
                                        <li><a href="index-hosting.html">Hosting & Domain</a></li>
                                        <li><a href="index-event.html">Event</a></li>
                                        <li><a href="index-course.html">Course </a></li>
                                        <li><a href="index-online-learning.html">Online Learning</a></li>
                                        <li><a href="index-single-product.html">Product </a></li>
                                        <li><a href="index-portfolio.html">Portfolio </a></li>
                                        <li><a href="index-job.html">Job</a></li>
                                        <li><a href="index-customer.html">Customer</a></li>
                                        <li><a href="index-social-marketing.html">Social Media</a></li>
                                        <li><a href="index-digital-agency.html">Digital Agency</a></li>
                                        <li><a href="index-onepage.html">Saas <span class="badge badge-pill badge-warning ml-2">Onepage</span></a></li>
                                    </ul>
                                </li>   
                            </ul>
                        </li>
        
                        <li class="has-submenu">
                            <a href="javascript:void(0)">Pages</a><span class="menu-arrow"></span>
                            <ul class="submenu">
                                <li><a href="page-aboutus.html"> About Us</a></li>
                                <li><a href="page-services.html">Services</a></li>
                                <li><a href="page-pricing.html">Pricing</a></li>
                                <li><a href="page-team.html"> Team</a></li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Account</a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-profile.html">Profile</a></li>
                                        <li><a href="page-profile-edit.html">Account Setting</a></li>
                                        <li><a href="page-invoice.html">Invoice</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Shop <span class="badge badge-danger rounded">v 2.2</span></a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="shop-products.html">All Products <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="shop-product-detail.html">Product Details <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="shop-cart.html">Shop Cart <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="shop-checkouts.html">Checkouts <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="shop-myaccount.html">My Account <span class="badge badge-primary rounded">new</span></a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Help center <span class="badge badge-danger rounded">v 2.2</span></a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="helpcenter-overview.html">Helpcenter <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="helpcenter-faqs.html">Faqs <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="helpcenter-guides.html">Guides <span class="badge badge-primary rounded">new</span></a></li>
                                        <li><a href="helpcenter-support-request.html">Support Call <span class="badge badge-primary rounded">new</span></a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Email Template</a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="email-confirmation.html">Confirmation</a></li>
                                        <li><a href="email-password-reset.html">Reset Password</a></li>
                                        <li><a href="email-alert.html">Alert</a></li>
                                        <li><a href="email-invoice.html">Invoice</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)">Careers</a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-jobs.html">Jobs</a></li>
                                        <li><a href="page-jobs-sidebar.html">Jobs - Sidebar</a></li>
                                        <li><a href="page-job-detail.html">Job Detail</a></li>
                                        <li><a href="page-job-apply.html">Job Apply</a></li>
                                        <li><a href="page-job-company.html">Company</a></li>
                                        <li><a href="page-job-candidate.html">Candidate</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Blog</a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-blog-grid.html">Blog Grid</a></li>
                                        <li><a href="page-blog-sidebar.html">Blog with Sidebar</a></li>
                                        <li><a href="page-blog-list.html">Blog Listing</a></li>
                                        <li><a href="page-blog-list-sidebar.html">Blog List & Sidebar</a></li>
                                        <li><a href="page-blog-detail.html">Blog Detail</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Works</a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-work-modern.html">Works Modern</a></li>
                                        <li><a href="page-work-classic.html">Works Classic</a></li>
                                        <li><a href="page-work-grid.html">Works Grid</a></li>
                                        <li><a href="page-work-masonry.html">Works Masonry</a></li>
                                        <li><a href="page-work-detail.html">Work Detail</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Auth Pages</a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="auth-login.html">Login</a></li>
                                        <li><a href="auth-cover-login.html">Login Cover</a></li>
                                        <li><a href="auth-login-three.html">Login Simple</a></li>
                                        <li><a href="auth-signup.html">Signup</a></li>
                                        <li><a href="auth-cover-signup.html">Signup Cover</a></li>
                                        <li><a href="auth-signup-three.html">Signup Simple</a></li>
                                        <li><a href="auth-re-password.html">Reset Password</a></li>
                                        <li><a href="auth-cover-re-password.html">Reset Password Cover</a></li>
                                        <li><a href="auth-re-password-three.html">Reset Password Simple</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Utility </a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-terms.html">Terms of Services</a></li>
                                        <li><a href="page-privacy.html">Privacy Policy</a></li>
                                    </ul>  
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Special </a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-comingsoon.html">Coming Soon</a></li>
                                        <li><a href="page-comingsoon2.html">Coming Soon Two </a></li>
                                        <li><a href="page-maintenance.html">Maintenance</a></li>
                                        <li><a href="page-error.html">Error</a></li>
                                    </ul>
                                </li>
                                <li class="has-submenu"><a href="javascript:void(0)"> Contact </a><span class="submenu-arrow"></span>
                                    <ul class="submenu">
                                        <li><a href="page-contact-detail.html">Contact Detail </a></li>
                                        <li><a href="page-contact-one.html">Contact One </a></li>
                                        <li><a href="page-contact-two.html">Contact Two </a></li>
                                        <li><a href="page-contact-three.html">Contact Three </a></li>
                                    </ul>  
                                </li>
                            </ul>
                        </li>
                        <li class="has-submenu">
                            <a href="javascript:void(0)">Docs</a><span class="menu-arrow"></span>
                            <ul class="submenu">
                                <li><a href="documentation.html">Documentation </a></li>
                                <li><a href="changelog.html">Changelog </a></li>
                                <li><a href="components.html">Components</a></li>
                                <li><a href="widget.html">Widget</a></li>
                            </ul>
                        </li>
                    </ul><!--end navigation menu-->
                    <div class="buy-menu-btn d-none">
                        <a href="https://1.envato.market/4n73n" target="_blank" class="btn btn-primary">Buy Now</a>
                    </div><!--end login button-->
                </div><!--end navigation-->
            </div><!--end container-->
        </header><!--end header-->
        <!-- Navbar End -->
        
        <!-- Hero Start -->
        <section class="bg-home d-flex align-items-center" style="background: url('images/single/bg01.jpg') center center; height: auto;" id="home">
            <div class="bg-overlay bg-overlay-white"></div>
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-md-9 text-center mt-0 mt-md-5 pt-0 pt-md-5">
                        <div class="title-heading margin-top-100">
                            <h1 class="display-4 font-weight-bold mb-3">DJI Professional Drone Camera</h1>
                            <p class="para-desc mx-auto text-muted">Launch your campaign and benefit from our expertise on designing and managing conversion centered bootstrap4 html page.</p>
                            <div class="watch-video mt-4 pt-2">
                                <a href="http://vimeo.com/99025203" class="video-play-icon watch text-dark"><i class="mdi mdi-play play-icon-circle text-center d-inline-block mr-2 rounded-circle title-dark text-white position-relative play play-iconbar"></i> WATCH VIDEO</a>
                            </div>
                        </div>

                        <div class="home-dashboard">
                            <img src="images/single/1.png" alt="" class="img-fluid mover">
                        </div>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
        </section><!--end section-->
        <!-- Hero End -->
        
        <!-- Feature Start -->
        <section class="section bg-light">
            <div class="container">
                <div class="row">
                    <div class="col-md-3 col-6 p-4 text-center">
                        <img src="images/icon/camera.svg" height="45" alt="">
                        <h5 class="mt-2">Camera</h5>
                        <p class="text-muted mb-0">48 mp at 60mtr</p>
                    </div><!--end col-->
                    
                    <div class="col-md-3 col-6 p-4 text-center">
                        <img src="images/icon/speedometer.svg" height="45" alt="">
                        <h5 class="mt-2">Speed</h5>
                        <p class="text-muted mb-0">50 kph</p>
                    </div><!--end col-->
                    
                    <div class="col-md-3 col-6 p-4 text-center">
                        <img src="images/icon/low-battery.svg" height="45" alt="">
                        <h5 class="mt-2">Battery</h5>
                        <p class="text-muted mb-0">1 hour and 30 min</p>
                    </div><!--end col-->
                    
                    <div class="col-md-3 col-6 p-4 text-center">
                        <img src="images/icon/game.svg" height="45" alt="">
                        <h5 class="mt-2">Control</h5>
                        <p class="text-muted mb-0">20 km Range</p>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
            
            <div class="container mt-100 mt-60">
                <div class="row align-items-center">
                    <div class="col-lg-6 col-md-6">
                        <img src="images/single/camera.png" class="img-fluid" alt="">
                    </div><!--end col-->

                    <div class="col-lg-6 col-md-6 mt-4 mt-sm-0 pt-2 pt-sm-0">
                        <div class="section-title ml-lg-3">
                            <h4 class="title mb-4">DJI 48MP Camera</h4>
                            <p class="text-muted">Due to its widespread use as filler text for layouts, non-readability is of great importance: human perception is tuned to recognize certain patterns and repetitions in texts. If the distribution of letters visual impact.</p>
                            <ul class="list-unstyled feature-list text-muted">
                                <li><i data-feather="check-circle" class="fea icon-sm text-success mr-2"></i>Digital Marketing Solutions for Tomorrow</li>
                                <li><i data-feather="check-circle" class="fea icon-sm text-success mr-2"></i>Create your own skin to match your brand</li>
                            </ul>
                            <a href="javascript:void(0)" class="mt-3 text-primary">Read more <i class="mdi mdi-chevron-right"></i></a>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
        </section><!--end section-->
        <!-- Feature End -->

        <!-- Description Start -->
        <section class="section">
            <div class="container">
                <div class="row">
                    <div class="col-12 text-center">
                        <img src="images/single/drone.gif" class="img-fluid" alt="">
                    </div><!--end col-->
                </div><!--end row-->

                <div class="row">
                    <div class="col-12 text-center">
                        <div class="section-title mb-4 pb-2">
                            <h4 class="title mb-4">Awesome Features</h4>
                            <p class="text-muted para-desc mx-auto mb-0">Start working with <span class="text-primary font-weight-bold">Landrick</span> that can provide everything you need to generate awareness, drive traffic, connect.</p>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->

                <div class="row">
                    <div class="col-lg-4 col-md-6 mt-4 pt-2">
                        <div class="media key-feature align-items-center p-3 rounded shadow">
                            <div class="icon text-center rounded-circle mr-3">
                                <i data-feather="camera" class="fea icon-ex-md text-primary"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="title mb-0">48mp Camera</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-4 col-md-6 mt-4 pt-2">
                        <div class="media key-feature align-items-center p-3 rounded shadow">
                            <div class="icon text-center rounded-circle mr-3">
                                <i data-feather="wifi" class="fea icon-ex-md text-primary"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="title mb-0">Faster Connection</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-4 col-md-6 mt-4 pt-2">
                        <div class="media key-feature align-items-center p-3 rounded shadow">
                            <div class="icon text-center rounded-circle mr-3">
                                <i data-feather="eye" class="fea icon-ex-md text-primary"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="title mb-0">Easy to Operate</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-4 col-md-6 mt-4 pt-2">
                        <div class="media key-feature align-items-center p-3 rounded shadow">
                            <div class="icon text-center rounded-circle mr-3">
                                <i data-feather="video" class="fea icon-ex-md text-primary"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="title mb-0">Stable Video</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-4 col-md-6 mt-4 pt-2">
                        <div class="media key-feature align-items-center p-3 rounded shadow">
                            <div class="icon text-center rounded-circle mr-3">
                                <i data-feather="rss" class="fea icon-ex-md text-primary"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="title mb-0">Powerful Antenna</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-4 col-md-6 mt-4 pt-2">
                        <div class="media key-feature align-items-center p-3 rounded shadow">
                            <div class="icon text-center rounded-circle mr-3">
                                <i data-feather="battery" class="fea icon-ex-md text-primary"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="title mb-0">Battery Backup</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-4 col-md-6 mt-4 pt-2">
                        <div class="media key-feature align-items-center p-3 rounded shadow">
                            <div class="icon text-center rounded-circle mr-3">
                                <i data-feather="cpu" class="fea icon-ex-md text-primary"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="title mb-0">Advance Technology</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-4 col-md-6 mt-4 pt-2">
                        <div class="media key-feature align-items-center p-3 rounded shadow">
                            <div class="icon text-center rounded-circle mr-3">
                                <i data-feather="compass" class="fea icon-ex-md text-primary"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="title mb-0">Easy Disassembly</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                    
                    <div class="col-lg-4 col-md-6 mt-4 pt-2">
                        <div class="media key-feature align-items-center p-3 rounded shadow">
                            <div class="icon text-center rounded-circle mr-3">
                                <i data-feather="git-merge" class="fea icon-ex-md text-primary"></i>
                            </div>
                            <div class="media-body">
                                <h4 class="title mb-0">Rebust Structure</h4>
                            </div>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->

            <div class="container mt-100 mt-60">
                <div class="row justify-content-center">
                    <div class="col-md-7">
                        <div class="position-relative">
                            <img src="images/single/bg02.jpg" class="rounded img-fluid mx-auto d-block" alt="">
                            <div class="play-icon">
                                <a href="http://vimeo.com/287684225" class="play-btn shadow video-play-icon">
                                    <i class="mdi mdi-play text-primary rounded-circle bg-white shadow"></i>
                                </a>
                            </div>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
        </section><!--end section-->
        <!-- Description End -->

        <!-- Testimonial Start -->
        <section class="section bg-light">
            <div class="container">
                <div class="row">
                    <div class="col-12 text-center">
                        <div class="section-title mb-4 pb-2">
                            <h4 class="title mb-4">Client's Feedback</h4>
                            <p class="text-muted para-desc mx-auto mb-0">Start working with <span class="text-primary font-weight-bold">Landrick</span> that can provide everything you need to generate awareness, drive traffic, connect.</p>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->

                <div class="row justify-content-center">
                    <div class="col-lg-12 pt-2 mt-2 text-center">
                        <div id="customer-testi" class="owl-carousel owl-theme">
                            <div class="card customer-testi m-2 text-center rounded shadow border-0">
                                <div class="card-body">
                                    <p class="text-muted h6 font-italic">" It seems that only fragments of the oem Ipsum', which is said to have originated in the 16th century. "</p>
                                    <img src="images/client/01.jpg" class="img-fluid avatar avatar-small mt-3 rounded-circle mx-auto shadow" alt="">
                                    <ul class="list-unstyled mb-0 mt-3">
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                    </ul>
                                    <h6 class="text-primary">- Thomas Israel <small class="text-muted">C.E.O</small></h6>
                                </div>
                            </div><!--end customer testi-->
                            
                            <div class="card customer-testi m-2 text-center rounded shadow border-0">
                                <div class="card-body">
                                    <p class="text-muted h6 font-italic">" The advantage of its Latin origin andor distract the viewer's attention from the layout. "</p>
                                    <img src="images/client/02.jpg" class="img-fluid avatar avatar-small mt-3 rounded-circle mx-auto shadow" alt="">
                                    <ul class="list-unstyled mb-0 mt-3">
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                    </ul>
                                    <h6 class="text-primary">- Carl Oliver <small class="text-muted">P.A</small></h6>
                                </div>
                            </div><!--end customer testi-->
                            
                            <div class="card customer-testi m-2 text-center rounded shadow border-0">
                                <div class="card-body">
                                    <p class="text-muted h6 font-italic">" There is now an abundance of readableives to the classic and tell short, funny or nonsensical stories. "</p>
                                    <img src="images/client/03.jpg" class="img-fluid avatar avatar-small mt-3 rounded-circle mx-auto shadow" alt="">
                                    <ul class="list-unstyled mb-0 mt-3">
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                    </ul>
                                    <h6 class="text-primary">- Barbara McIntosh <small class="text-muted">M.D</small></h6>
                                </div>
                            </div><!--end customer testi-->
                            
                            <div class="card customer-testi m-2 text-center rounded shadow border-0">
                                <div class="card-body">
                                    <p class="text-muted h6 font-italic">" According to most sources, Lorum Ipsuthe origin of the text by of the unusual word  he could find "</p>
                                    <img src="images/client/04.jpg" class="img-fluid avatar avatar-small mt-3 rounded-circle mx-auto shadow" alt="">
                                    <ul class="list-unstyled mb-0 mt-3">
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                    </ul>
                                    <h6 class="text-primary">- Christa Smith <small class="text-muted">Manager</small></h6>
                                </div>
                            </div><!--end customer testi-->
                            
                            <div class="card customer-testi m-2 text-center rounded shadow border-0">
                                <div class="card-body">
                                    <p class="text-muted h6 font-italic">" It seems that only fragments of the oem Ipsum', which is said to have originated in the 16th century. "</p>
                                    <img src="images/client/05.jpg" class="img-fluid avatar avatar-small mt-3 rounded-circle mx-auto shadow" alt="">
                                    <ul class="list-unstyled mb-0 mt-3">
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                    </ul>
                                    <h6 class="text-primary">- Dean Tolle <small class="text-muted">Developer</small></h6>
                                </div>
                            </div><!--end customer testi-->
                            
                            <div class="card customer-testi m-2 text-center rounded shadow border-0">
                                <div class="card-body">
                                    <p class="text-muted h6 font-italic">" It seems that only fragments of the otime certain letters at various positions within the text. "</p>
                                    <img src="images/client/06.jpg" class="img-fluid avatar avatar-small mt-3 rounded-circle mx-auto shadow" alt="">
                                    <ul class="list-unstyled mb-0 mt-3">
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                        <li class="list-inline-item"><i class="mdi mdi-star text-warning"></i></li>
                                    </ul>
                                    <h6 class="text-primary">- Jill Webb <small class="text-muted">Designer</small></h6>
                                </div>
                            </div><!--end customer testi-->
                        </div><!--end owl carousel-->
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->

            <!-- Partners start -->
            <div class="container mt-5 pt-3">
                <div class="row justify-content-center">
                    <div class="col-lg-2 col-md-2 col-6 text-center">
                        <img src="images/client/amazon.svg" class="avatar avatar-ex-sm" alt="">
                    </div><!--end col-->

                    <div class="col-lg-2 col-md-2 col-6 text-center">
                        <img src="images/client/google.svg" class="avatar avatar-ex-sm" alt="">
                    </div><!--end col-->
                    
                    <div class="col-lg-2 col-md-2 col-6 text-center mt-4 mt-sm-0">
                        <img src="images/client/lenovo.svg" class="avatar avatar-ex-sm" alt="">
                    </div><!--end col-->
                    
                    <div class="col-lg-2 col-md-2 col-6 text-center mt-4 mt-sm-0">
                        <img src="images/client/paypal.svg" class="avatar avatar-ex-sm" alt="">
                    </div><!--end col-->
                    
                    <div class="col-lg-2 col-md-2 col-6 text-center mt-4 mt-sm-0">
                        <img src="images/client/shopify.svg" class="avatar avatar-ex-sm" alt="">
                    </div><!--end col-->
                    
                    <div class="col-lg-2 col-md-2 col-6 text-center mt-4 mt-sm-0">
                        <img src="images/client/spotify.svg" class="avatar avatar-ex-sm" alt="">
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
        </section><!--end section-->
        <!-- Testimonial End -->

        <!-- Gallery Start -->
        <section class="section">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-md-6">
                        <div class="slider slider-for">
                            <div><img src="images/single/01.jpg" class="img-fluid rounded" alt=""></div>
                            <div><img src="images/single/02.jpg" class="img-fluid rounded" alt=""></div>
                            <div><img src="images/single/03.jpg" class="img-fluid rounded" alt=""></div>
                            <div><img src="images/single/04.jpg" class="img-fluid rounded" alt=""></div>
                            <div><img src="images/single/05.jpg" class="img-fluid rounded" alt=""></div>
                            <div><img src="images/single/06.jpg" class="img-fluid rounded" alt=""></div>
                            <div><img src="images/single/07.jpg" class="img-fluid rounded" alt=""></div>
                        </div>
                        <div class="slider slider-nav">
                            <div><img src="images/single/01.jpg" class="img-fluid" alt=""></div>
                            <div><img src="images/single/02.jpg" class="img-fluid" alt=""></div>
                            <div><img src="images/single/03.jpg" class="img-fluid" alt=""></div>
                            <div><img src="images/single/04.jpg" class="img-fluid" alt=""></div>
                            <div><img src="images/single/05.jpg" class="img-fluid" alt=""></div>
                            <div><img src="images/single/06.jpg" class="img-fluid" alt=""></div>
                            <div><img src="images/single/07.jpg" class="img-fluid" alt=""></div>
                        </div>
                    </div><!--end col-->

                    <div class="col-md-6 mt-4 mt-sm-0 pt-2 pt-sm-0">
                        <div class="section-title ml-md-4">
                            <h4 class="title mb-4">DJI Spark Drone</h4>
                            <div class="d-flex justify-content-between my-4">
                                <h4 class="mb-0"><b>$ 1800</b></h4>
                                <div class="text-warning">
                                    <span class="mdi mdi-star"></span>
                                    <span class="mdi mdi-star"></span>
                                    <span class="mdi mdi-star"></span>
                                    <span class="mdi mdi-star"></span>
                                    <span class="mdi mdi-star-half"></span>
                                    <span class="text-muted pl-2">23 Reviews</span>
                                </div>
                            </div>
                            <p class="text-muted para-desc mx-auto">Start working with <span class="text-primary font-weight-bold">Landrick</span> that can provide everything you need to generate awareness, drive traffic, connect. This is required when, for example, the final text is not yet available. Dummy text is also known as 'fill text'. It is said that song composers of the past used dummy texts as lyrics when writing melodies in order to have a 'ready-made' text to sing with the melody.</p>
                            <ul class="list-unstyled feature-list text-muted">
                                <li><i class="mdi mdi-check mr-2"></i>Digital Marketing Solutions for Tomorrow</li>
                                <li><i class="mdi mdi-check mr-2"></i>Create your own skin to match your brand</li>
                                <li><i class="mdi mdi-check mr-2"></i>Digital Marketing Solutions for Tomorrow</li>
                                <li><i class="mdi mdi-check mr-2"></i>Create your own skin to match your brand</li>
                            </ul>
                            <div class="mt-4">
                                <a href="javascript:void(0)" class="btn btn-primary">Buy Now</a>
                            </div>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->

            <div class="container mt-100 mt-60">
                <div class="row justify-content-center">
                    <div class="col-12 text-center">
                        <div class="section-title mb-4 pb-2">
                            <h4 class="title mb-4">Sign up for our Newsletter</h4>
                            <p class="text-muted para-desc mx-auto mb-0">Start working with <span class="text-primary font-weight-bold">Landrick</span> that can provide everything you need to generate awareness, drive traffic, connect.</p>
                        </div>
                    </div><!--end col-->
                </div><!--end row-->

                <div class="row justify-content-center mt-4 pt-2">
                    <div class="col-lg-7 col-md-10">
                        <form>
                            <div class="form-group">
                                <div class="input-group mb-3">
                                    <input name="email" id="email" type="email" class="form-control" placeholder="Your email :" required="" aria-describedby="newssubscribebtn">
                                    <div class="input-group-append">
                                        <button class="btn btn-primary submitBnt" type="submit" id="newssubscribebtn">Subscribe</button>
                                    </div>
                                </div>
                            </div>
                        </form><!--end form-->
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--END container-->
        </section><!--end section-->
        <!-- Gallery End -->

        <!-- Footer Start -->
        <footer class="footer">
            <div class="container">
                <div class="row">
                    <div class="col-lg-4 col-12 mb-0 mb-md-4 pb-0 pb-md-2">
                        <a href="#" class="logo-footer">
                            <img src="images/logo-light.png" height="24" alt="">
                        </a>
                        <p class="mt-4">Start working with Landrick that can provide everything you need to generate awareness, drive traffic, connect.</p>
                        <ul class="list-unstyled social-icon social mb-0 mt-4">
                            <li class="list-inline-item"><a href="javascript:void(0)" class="rounded"><i data-feather="facebook" class="fea icon-sm fea-social"></i></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)" class="rounded"><i data-feather="instagram" class="fea icon-sm fea-social"></i></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)" class="rounded"><i data-feather="twitter" class="fea icon-sm fea-social"></i></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)" class="rounded"><i data-feather="linkedin" class="fea icon-sm fea-social"></i></a></li>
                        </ul><!--end icon-->
                    </div><!--end col-->
                    
                    <div class="col-lg-2 col-md-4 col-12 mt-4 mt-sm-0 pt-2 pt-sm-0">
                        <h4 class="text-light footer-head">Company</h4>
                        <ul class="list-unstyled footer-list mt-4">
                            <li><a href="page-aboutus.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> About us</a></li>
                            <li><a href="page-services.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Services</a></li>
                            <li><a href="page-team.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Team</a></li>
                            <li><a href="page-pricing.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Pricing</a></li>
                            <li><a href="page-work-modern.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Project</a></li>
                            <li><a href="page-jobs.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Careers</a></li>
                            <li><a href="page-blog-grid.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Blog</a></li>
                            <li><a href="auth-cover-login.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Login</a></li>
                        </ul>
                    </div><!--end col-->
                    
                    <div class="col-lg-3 col-md-4 col-12 mt-4 mt-sm-0 pt-2 pt-sm-0">
                        <h4 class="text-light footer-head">Usefull Links</h4>
                        <ul class="list-unstyled footer-list mt-4">
                            <li><a href="page-terms.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Terms of Services</a></li>
                            <li><a href="page-privacy.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Privacy Policy</a></li>
                            <li><a href="documentation.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Documentation</a></li>
                            <li><a href="changelog.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Changelog</a></li>
                            <li><a href="components.html" class="text-foot"><i class="mdi mdi-chevron-right mr-1"></i> Components</a></li>
                        </ul>
                    </div><!--end col-->

                    <div class="col-lg-3 col-md-4 col-12 mt-4 mt-sm-0 pt-2 pt-sm-0">
                        <h4 class="text-light footer-head">Newsletter</h4>
                        <p class="mt-4">Sign up and receive the latest tips via email.</p>
                        <form>
                            <div class="row">
                                <div class="col-lg-12">
                                    <div class="foot-subscribe form-group position-relative">
                                        <label>Write your email <span class="text-danger">*</span></label>
                                        <i data-feather="mail" class="fea icon-sm icons"></i>
                                        <input type="email" name="email" id="emailsubscribe" class="form-control pl-5 rounded" placeholder="Your email : " required>
                                    </div>
                                </div>
                                <div class="col-lg-12">
                                    <input type="submit" id="submitsubscribe" name="send" class="btn btn-soft-primary btn-block" value="Subscribe">
                                </div>
                            </div>
                        </form>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
        </footer><!--end footer-->
        <footer class="footer footer-bar">
            <div class="container text-center">
                <div class="row align-items-center">
                    <div class="col-sm-6">
                        <div class="text-sm-left">
                            <p class="mb-0">© 2019-20 Landrick. Design with <i class="mdi mdi-heart text-danger"></i> by <a href="http://www.shreethemes.in/" target="_blank" class="text-reset">Shreethemes</a>.</p>
                        </div>
                    </div><!--end col-->

                    <div class="col-sm-6 mt-4 mt-sm-0 pt-2 pt-sm-0">
                        <ul class="list-unstyled text-sm-right mb-0">
                            <li class="list-inline-item"><a href="javascript:void(0)"><img src="images/payments/american-ex.png" class="avatar avatar-ex-sm" title="American Express" alt=""></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)"><img src="images/payments/discover.png" class="avatar avatar-ex-sm" title="Discover" alt=""></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)"><img src="images/payments/master-card.png" class="avatar avatar-ex-sm" title="Master Card" alt=""></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)"><img src="images/payments/paypal.png" class="avatar avatar-ex-sm" title="Paypal" alt=""></a></li>
                            <li class="list-inline-item"><a href="javascript:void(0)"><img src="images/payments/visa.png" class="avatar avatar-ex-sm" title="Visa" alt=""></a></li>
                        </ul>
                    </div><!--end col-->
                </div><!--end row-->
            </div><!--end container-->
        </footer><!--end footer-->
        <!-- Footer End -->

        <!-- Start Style switcher -->
        <div id="style-switcher" style="left: 0px;" class="bg-light border p-3 pt-2 pb-2">
            <h3 class="title text-center">Select Your Color</h3>
            <ul class="pattern text-center mb-2">
                <li class="list-inline-item">
                    <a class="default" href="#"></a>
                </li>
                <li class="list-inline-item">
                    <a class="green" href="#"></a>
                </li>
                <li class="list-inline-item">
                    <a class="red" href="#"></a>
                </li>
                <li class="list-inline-item">
                    <a class="skyblue" href="#"></a>
                </li>
                <li class="list-inline-item">
                    <a class="skobleoff" href="#"></a>
                </li>  
                <li class="list-inline-item">
                    <a class="cyan" href="#"></a>
                </li>            
            </ul>

            <h3 class="title text-center pt-3 mb-0 border-top">Theme Option</h3>
            <div class="text-center">
                <a href="#" class="btn btn-sm w-100 btn-primary rtl-version t-rtl-light mt-2">RTL</a>
                <a href="#" class="btn btn-sm w-100 btn-primary ltr-version t-ltr-light mt-2">LTR</a>
                <a href="#" class="btn btn-sm w-100 btn-primary dark-rtl-version t-rtl-dark mt-2">RTL</a>
                <a href="#" class="btn btn-sm w-100 btn-primary dark-ltr-version t-ltr-dark mt-2">LTR</a>
                <a href="#" class="btn btn-sm w-100 btn-dark dark-version t-dark mt-2">Dark</a>
                <a href="#" class="btn btn-sm w-100 btn-dark light-version t-light mt-2">Light</a>
            </div>
            <div class="bottom">
                <a href="#" class="settings bg-white shadow d-block"><i class="mdi mdi-cog ml-1 mdi-24px position-absolute mdi-spin text-primary"></i></a>
            </div>
        </div>
        <!-- End Style switcher -->

        <!-- Back to top -->
        <a href="#" class="btn btn-icon btn-soft-primary back-to-top"><i data-feather="arrow-up" class="icons"></i></a>
        <!-- Back to top -->

        <!-- javascript -->
        <script src="js/jquery-3.5.1.min.js"></script>
        <script src="js/bootstrap.bundle.min.js"></script>
        <script src="js/jquery.easing.min.js"></script>
        <script src="js/scrollspy.min.js"></script>
        <!-- Magnific Popup -->
        <script src="js/jquery.magnific-popup.min.js"></script>
        <script src="js/magnific.init.js"></script>
        <!-- SLIDER -->
        <script src="js/owl.carousel.min.js "></script>
        <script src="js/owl.init.js "></script>
        <!-- Slick -->
        <script src="js/slick.min.js"></script>
        <script src="js/slick.init.js"></script>
        <!-- Icons -->
        <script src="js/feather.min.js"></script>
        <script src="https://unicons.iconscout.com/release/v2.1.9/script/monochrome/bundle.js"></script>
        <!-- Switcher -->
        <script src="js/switcher.js"></script>
        <!-- Main Js -->
        <script src="js/app.js"></script>
    </body>
</html>